<!DOCTYPE html>
<html>
<head>
  <meta content="IE=11.0000" http-equiv="X-Ua-Compatible">
  <meta charset="utf-8">
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-Ua-Compatible" content="IE=edge,chrome=1">

  <title>发起委托-0805</title>
  <!--region 引入公用js和css -->
  <link href="../../assets/plugins/animate/animate.css" rel="stylesheet">
  <link href="../../assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/fullcalendar/fullcalendar.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/base/css/components.css" rel="stylesheet" id="style_components" type="text/css"/>
  <link href="../../assets/base/css/plugins.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/ditop/layout.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/datatables/datatables.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/bootstrap-table/bootstrap-table.css" rel="stylesheet">
  <link href="../../assets/plugins/bootstrap-table/extensions/tree-column/bootstrap-table-tree-column.css" rel="stylesheet">
  <link href="../../assets/plugins/bootstrap-toastr/toastr.css" rel="stylesheet">
  <link rel="stylesheet" href="../../assets/plugins/sweetalert/sweetalert.css">
  <link rel="stylesheet" href="../../assets/plugins/layer/theme/default/layer.css">
  <link href="../../assets/plugins/select2/css/select2.min.css" rel="stylesheet">
  <link href="../../assets/plugins/icheck/skins/flat/aero.css" rel="stylesheet">
  <link href="../../assets/ditop/ditop.css" rel="stylesheet">
  <link href="../../assets/ditop/style/ztree/style9/treestyle.css" rel="stylesheet">
  <link href="../../assets/plugins/bootstrap-touchspin/bootstrap.touchspin.css" rel="stylesheet">

  <link href="../../assets/plugins/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet" type="text/css"/>
  <link href="../../assets/plugins/bootstrap-daterangepicker-extend/daterangepicker-ext.css" rel="stylesheet" type="text/css"/>

  <script src="../../assets/plugins/jquery/jquery.min.js"></script>
  <script src="../../assets/plugins/bootstrap/js/bootstrap.min.js"></script>
  <script src="../../assets/plugins/bootstrap-toastr/toastr.js"></script>
  <script src="../../assets/plugins/art-template/template.js"></script>
  <script src="../../assets/plugins/layer/layer.js"></script>
  <script src="../../assets/ditop/ditop.js"></script>
  <!--endregion-->
  <link href="../../assets/module/gcjsy/gcjsy-comp.css" rel="stylesheet">
  <link href="../drawing_review.css" rel="stylesheet"> <!-- CSS Customization -->
  <!--<link href="../../assets/module/gcjsy/css/pagination.css" rel="stylesheet">-->



  <link href="wt.css" rel="stylesheet">

</head>

<body class="min1280">
<div class="page-wrapper">
  
  <div class="page-header navbar">
    <div class="page-header-inner clearfix">
      <div class="logo pull-left">
        <a href="#"><img src="../../assets/images/logo/logo.png" alt="logo" class="logo-default"/> </a>
      </div>
      <div class="menu-toggler sidebar-toggler" style="height: 0"></div>
      <div class="main-menu pull-left">
        <ul class="nav navbar-nav">
          <li id="home">
            <span>首页</span>
          </li>
          <li>
            <div class="header-type">
              <span>动态</span>
            </div>
          </li>
          <li>
            <div class="header-type">
              <span>办事</span>
            </div>
          </li>
          <li class="active-menu">
            <div class="header-type">
              <span>应用</span>
            </div>
          </li>
        </ul>
      </div>
      <div class="top-menu pull-right">
        <ul class="nav navbar-nav">
          <li><a href="#"><i class="dtFont dtFont-msg"></i><span class="badge badge-danger"> 9 </span></a>
          </li>
          <li><a href="#"><i class="dtFont dtFont-naozhong"></i><span class="badge badge-info"> 1 </span></a></li>
          <li><a href="#"><i class="dtFont dtFont-gonggao"></i><span class="badge badge-info"></span></a></li>
          <li><a href="#"><i class="dtFont dtFont-help"></i></a></li>
          
          
          <li class="dropdown">
            <a href="#" class="dropdown-toggle user-info" data-toggle="dropdown"
               data-hover="dropdown" data-close-others="true"><i class="dtFont dtFont-my_icon"></i></a>
            <ul class="dropdown-menu dropdown-menu-default pull-right	">
              <li class="profile">
                <a href="javascript:;"> <i class="icon-user"></i> 个人中心</a>
              </li>
              <li class="changePassword">
                <a href="javascript:;"> <i class="icon-key"></i> 修改密码</a>
              </li>
              <li class="feedBack">
                <a href="javascript:;"> <i class="icon-bubbles"></i> 给管理员留言</a>
              </li>
              <li class="divider"></li>
              <li class="logout">
                <a href="javascript:;"> <i class="icon-close"></i>退出</a>
              </li>
            </ul>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="page-container clearfix">
    <!--<div class="headTitle padding-lr-16 clearfix padding-top-5">-->
      <!--<ul class="page-crumbs pull-left">-->
        <!--<li>您的位置：</li>-->
        <!--<li><a href="javascript:;">项目库</a></li>-->
        <!--<li><a href="javascript:;">项目委托</a></li>-->
        <!--<li><a href="javascript:;">发起委托</a></li>-->
      <!--</ul>-->
      <!--<a class="pull-right" href="javascript:;">返回上一级</a>-->
    <!--</div>-->
    <div class="page-box">
      <div class="wt clearfix">
        <div class="wt-left-box">
          <div class="talk">
            <ul class="talk-list" id="talk-list">
              <li class="machine">
                <span>我是智能机器人小云，现在由我来带你填写表单</span>
              </li>
              <li class="machine">
                <span>请先选择业务类别 （<a class="question" href="javascript:;" data-id="1">什么是委托方式？</a>）</span>
              </li>
              <!--<li class="user">
                <span>什么是委托方式</span>
              </li>
              <li class="machine">
                <span>请先选择业务类别（<a href="#">什么是委托方式？</a>）</span>
              </li>
              <li class="machine">
                <span>承接单位为联合体时，系统默认由选择的第1家承接单位在系统中进行工程承接操作，确认承接后将自动与联合体的其他单位建立委托关系。</span>
              </li>-->
            </ul>
            <div class="send clearfix">
              <input type="text" id="inputText">
              <span class="send-btn" id="send">
                <i class="dtFont dtFont-fasong"></i>
              </span>
            </div>
          </div>
        </div>
        <div class="wt-right-box">

          <div class="wt-right-box-title">
            <h3>合肥融创壹号院-施工总承包</h3>
          </div>
          <div class="wt-right-box-con padding-bottom-65">

            <div class="wt-tab clearfix">
              <div class="wt-label">
                <span>发包方式</span>
              </div>
              <div class="navTabs pull-left" id="navTabs">
                <a class="grayLine basicsBtn margin-right-10" href="javascript:;">自主发包</a>
                <a class="grayLine basicsBtn" href="javascript:;">委托招标</a>
              </div>
            </div>
            <div class="input-form display-none" id="category">
              <div class="found-item">
                <b class="found-title">业务类别</b>
                <label class="found-right">
                  <select class="querySelect" id="actiBusiType">
                    <option value="">option1</option>
                    <option value="">option2</option>
                    <option value="">option3</option>
                    <option value="">option4</option>
                  </select>
                  <span class="help-block">爱傻傻的你就看接口</span>
                </label>

              </div>
            </div>

            <div class="input-form display-none" id="found">
              <div class="found-item">
                <b class="found-title">工程名称</b>
                <label class="found-right">
                  <textarea class="form-control" style="width: 414px;height: 80px;"></textarea>
                  <span class="help-block"></span>
                </label>
              </div>
              <div class="found-item clearfix margin-bottom-20">
                <div class="wt-label">
                  <span>承接单位是否为联合体</span>
                </div>
                <div class="navTabs pull-left">
                  <a class="blue basicsBtn margin-right-10" href="javascript:;">联合体</a>
                  <a class="grayLine basicsBtn" href="javascript:;">1 家承接单位</a>
                </div>
              </div>
              <div class="found-item clearfix">
                <div class="wt-label">
                  <span>选择承接单位</span>
                </div>
                <div class="pull-left">
                  <input onblur="hideItem();" type="text" class="form-control" placeholder="安徽德拓信息科技有限公司" style="width: 480px;">
                </div>
              </div>
            </div>

            <div class="ip-tab display-none">
              <section class="active">
                <img class="active" src="po1.png" alt="">
              </section>
              <section>
                <img src="po2.png" alt="">
                <p>比如你委托一家A招标代理机构对你的建设项目进行施工监理招投标，那只需在系统中创建一个项目施工监理招标代理的委托发送给招标代理机构就可以了，具体的施工标段、监理都不需要再逐个发委托了，施工、监理具体的中标结果由招标代理机构进行数据同步并完善”</p>
              </section>
            </div>

            <div class="referTo arc border wtReferTo">
              <button class="basicsBtn grayLine" id="repulse" href="javascript:window.history.go(-1);">取消</button>
              <button type="button" class="basicsBtn blue" href="javascript:;" id="saveBtnId">确定</button>
            </div>
          </div>

        </div>
      </div>
    </div>


  </div>
</div>

<div class="mask-guide">

  <img class="guide guide3" src="yindao2.png">
  <img class="guide guide4 display-none" src="yindao1.png">
</div>
<script>
  $(function () {

    //操作流程模拟
    +function () {
      var firstUse = true;
      var $actiBusiType = $('#actiBusiType');
      var navTabs = $('#navTabs');
      var category = $('#category');
      var Top = navTabs.offset().top;
      var Left = navTabs.offset().left;
      $('.guide3').show().css({
        'top' : Top - 27 + 'px',
        'left' : Left + 200 + 'px'
      });
      navTabs.children('.basicsBtn').on('click',function () {
        $('.guide3').hide();
        var index = $(this).index();
        $(this).addClass('blue').siblings().removeClass('blue');
        $('.ip-tab').show().children('section').eq(index).addClass('active').siblings().removeClass('active');
        category.show();
        if(firstUse){
          $('.guide4').show().css({
            'top' : category.offset().top - 27 + 'px',
            'left' : Left + 240 + 'px'
          });firstUse = false
        }
      });
      $actiBusiType.change(function () {
        $('.guide4').hide();
        $('#found').show();
      });
    }();

    // 对话模拟
    +function (){
      var aqArr = [
        {
          id:'1',
          q:'什么是业务类别?',
          a:'是指你发包工程项目是什么业务，比如施工图设计，那业务类别就是“设计”'
        },{
          id:'2',
          q:'什么是自主发包?',
          a:'不通过委托招标代理机构进行招标的委托形式都属于自主发包，包括自主招标'
        }
      ];
      function isNull( str ){
        if ( str === "" ) return true;
        var reg = "^[ ]+$";
        return new RegExp(reg).test(str);
      }

      var inputText = $('#inputText');
      var talkList = $("#talk-list");
      $('#send').on('click',send);

      function appendQ(data){
        var txt = "<li class='user'><span>"+data+"</span></li>";
        var h = talkList.prop('scrollHeight');
        talkList.append(txt).scrollTop(h);
      }

      function appendA(data){
        var atxt = "<li class='machine'><span>"+data+"</span></li>";
        var h = talkList.prop('scrollHeight');
        talkList.append(atxt).scrollTop(h);
      }

      $(document).on('click','.question',function(){
        var id = $(this).data('id');
        var aItem = aqArr.filter(function (item) {
          return item.id == id;
        })[0];
        appendQ(aItem.q);
        appendA(aItem.a)
      });

      function send() {
        var val = inputText.val();
        if(!isNull(val)){
          appendQ(val);
          inputText.val('');
          reply(val)
        }else {
          //alert('物质字符')
        }
      }

      function reply(data){
        var aItem = aqArr.filter(function (item) {
          return item.q == data;
        });
        if(aItem.length!==0){
          appendA(aItem[0].a);
        }else {
          var atxt = "";
          for (var i =0 ; i<aqArr.length ;i++){
            atxt += "<br><a class='question' href='javascript:;' data-id='"
              +aqArr[i].id+"'>"+(i+1)+"."+aqArr[i].q+"</a>";
          }
          appendA('没有匹配到这个问题答案,你可以输入或点击'+atxt);
        }
      }

      document.onkeydown=function(event) {
        var e = event || window.event || arguments.callee.caller.arguments[0];
        if (e && e.keyCode == 13) {
          $('#send').click();
        }
      }
    }()
    
  });
  function hideItem() {
    alert(1)
  }
</script>
<!--region 引入公用js和css -->
<script src="../../assets/plugins/sweetalert/sweetalert.min.js"></script>
<script src="../../assets/plugins/jquery.blockui.min.js"></script>
<script src="../../assets/plugins/js.cookie.min.js"></script>
<script src="../../assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<script src="../../assets/plugins/jquery.blockui.min.js"></script>
<script src="../../assets/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
<script src="../../assets/plugins/bootstrap-touchspin/bootstrap.touchspin.js"></script>
<script src="../../assets/plugins/moment.min.js"></script>
<script src="../../assets/plugins/bootstrap-daterangepicker/daterangepicker.min.js"></script>
<script src="../../assets/plugins/counterup/jquery.waypoints.min.js"></script>
<script src="../../assets/plugins/counterup/jquery.counterup.min.js"></script>
<script src="../../assets/plugins/fullcalendar/fullcalendar.js"></script>
<script src="../../assets/plugins/horizontal-timeline/horizontal-timeline.js"></script>
<script src="../../assets/plugins/jquery.sparkline.min.js"></script>
<script src="../../assets/plugins/select2/js/select2.js"></script>
<script src="../../assets/plugins/select2/js/i18n/zh-CN.js"></script>
<script src="../../assets/plugins/ztree/jquery.ztree.all.js"></script>
<script src="../../assets/plugins/jquery-form/jquery.form.js"></script>
<script src="../../assets/plugins/jquery-validator/jquery.placeholder.min.js"></script>
<script src="../../assets/plugins/jquery-validator/jquery.validate.js"></script>
<script src="../../assets/plugins/jquery-validator/jquery.validate.custom.js"></script>
<script src="../../assets/plugins/jquery-validator/localization/messages_zh.js"></script>
<script src="../../assets/plugins/jquery-validator/additional-methods.js"></script>
<script src="../../assets/plugins/bootstrap-growl/jquery.bootstrap-growl.js"></script>
<script src="../../assets/plugins/bootstrap-table/bootstrap-table.js"></script>
<script src="../../assets/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
<script src="../../assets/plugins/bootstrap-table/extensions/tree-column/bootstrap-table-tree-column.js"></script>
<script src="../../assets/base/scripts/app.js"></script>
<script src="../../assets/base/scripts/theme.js"></script>
<script src="../../assets/ditop/ditop-addition.js"></script>
<script src="../../assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
<script src="../../assets/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"
        type="text/javascript"></script>
<script type="text/javascript" src="../../assets/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"
        charset="UTF-8"></script>
<script type="text/javascript"
        src="../../assets/plugins/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"
        charset="UTF-8"></script>
<script src="../../assets/plugins/jquery-validator/jquery.validate.custom.js"></script>
<script src="../../assets/ditop/layout.js"></script>
<script src="../../assets/module/gcjsy/js/content.js"></script>
<script>

  // 对话模拟
$(function () {
  var aqArr = [
    {
      id:'1',
      q:'什么是委托方式?',
      a:'是指你发包工程项目是什么业务，比如施工图设计，那业务类别就是“设计”'
    },{
      id:'2',
      q:'什么是自主发包?',
      a:'不通过委托招标代理机构进行招标的委托形式都属于自主发包，包括自主招标'
    },{
      id:'3',
      q:'我爱你',
      a:'你是个好人'
    }
  ];
  function isNull( str ){
    if ( str === "" ) return true;
    var reg = "^[ ]+$";
    return new RegExp(reg).test(str);
  }

  var inputText = $('#inputText');
  var talkList = $("#talk-list");
  $('#send').on('click',send);

  function appendQ(data){
    var txt = "<li class='user'><span>"+data+"</span></li>";
    var h = talkList.prop('scrollHeight');
    talkList.append(txt).scrollTop(h);
  }

  function appendA(data){
    var atxt = "<li class='machine'><span>"+data+"</span></li>";
    var h = talkList.prop('scrollHeight');
    talkList.append(atxt).scrollTop(h);
  }


  $(document).on('click','.question',function(){
    var id = $(this).data('id');
    var aItem = aqArr.filter(item => item.id==id )[0];
    appendQ(aItem.q);
    appendA(aItem.a)
  });

  function send() {
    var val = inputText.val();
    if(!isNull(val)){
      appendQ(val);
      inputText.val('');
      reply(val)
    }else {
      //alert('物质字符')
    }
  }

  function reply(data){
    var aItem = aqArr.filter(item => item.q == data);
    if(aItem.length!==0){
      appendA(aItem[0].a);
    }else {
      var atxt = "";
      for (var i =0 ; i<aqArr.length ;i++){
        atxt += "<br><a class='question' href='javascript:;' data-id='"
          +aqArr[i].id+"'>"+(i+1)+"."+aqArr[i].q+"</a>";
      }
      appendA('没有匹配到这个问题答案,你可以输入或点击'+atxt);
    }
  }

  document.onkeydown=function(event) {
    var e = event || window.event || arguments.callee.caller.arguments[0];
    if (e && e.keyCode == 13) {
      $('#send').click();
    }
  }
});

</script>
</body>
</html>
